<template>
    <div class="location"  @click="cityClick">
        <div class="city">{{ store.currentCity.cityName }}</div>
        <div class="my_location">
            <span class="words" @click="locationClick">我的位置</span>
            <img src="../../../resets/image/location.png" alt="">
        </div>
    </div>
</template>
<script setup>
import { storeToRefs } from 'pinia';
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import useCityStore from '../../../stores/modules/cityStore';

//获取当前路由
const router = useRouter();
//获取pinia
const store =  useCityStore();
//切换城市
function cityClick()
{
    router.push("/city");
}
</script>
<style lang="less" scoped>
.location
{
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex: 1;
    color: #333;
    font-size: 14px;
    padding: 10px;
    padding-top: 10px;

    .my_location
    {
        display: flex;
        align-items: center;
        font-size: 12px;
        color: #999;
        img
        {
           margin-left:10px ;
           width: 30px;
        }
    }

}
</style>